<template>
  <div class="app-container">
    <el-row type="flex" style="justify-content: space-between;">
      <div style="flex: 1;min-width: 0;margin-top: 10px;">
        <customerInformation v-model="customerList" :type="$route.query.type" />
        <statementOfWriteOff v-model="form" :type="$route.query.type" state='detail' />
      </div>
      <FlowRecord :id="form.flowId" style="margin-left: 15px;" />
    </el-row>

    <div style="text-align: right;box-sizing: border-box;padding-right: 20px;margin-top: 20px; background-color: #fff;width: 100%;height: 60px;line-height: 60px;border-radius: 8px;">
      <el-button @click="back" type="primary">返回</el-button>
    </div>
  </div>
</template>

<script>
import customerInformation from "../components/customerInformation";
import statementOfWriteOff from "../components/statementOfWriteOff";
import { collectionWriteOffApplicationDetail } from "@/api/collectionModule";
export default {
  // 申请销账页面
  name: 'WriteOffDetails',
  components: {
    customerInformation,
    statementOfWriteOff
  },
  data() {
    return {
      form: {},
      customerList: [],
      loading: false
    };
  },
  created() {
    this.collectionWriteOffApplicationDetail()
  },
  methods: {
    async collectionWriteOffApplicationDetail() {
      this.loading = true
      try {
        let res = await collectionWriteOffApplicationDetail(this.$route.query.id)
        this.$set(this.form, 'manageId', this.$route.query.id)
        this.$set(this.form, 'amount', res.data.totalWriteOffAmount)
        this.loading = false
        this.form = {
          ...res.data,
          flowId: res.data.flowId.toString()
        }
        this.customerList = [{ customer: res.data.customer, overdueInformation: res.data.overdueInformation, totalOfReceivableAmount: res.data.totalOfReceivableAmount, totalOfWaitAmount: res.data.totalOfWaitAmount, totalOfReceivedAmount: res.data.totalOfReceivedAmount, totalWriteOffAmount: res.data.totalWriteOffAmount, totalOfThisMonth: res.data.totalOfThisMonth, totalOfToDay: res.data.totalOfToDay, collectionProgress: res.data.collectionProgress, code: res.data.code, approvalStatus: res.data.approvalStatus, totalOfCanWritableAmount: res.data.totalOfCanWritableAmount }]
      } catch (error) { }
    },
    back() {
      this.$tab.closeOpenPage(this.$route);
      this.$router.go(-1);
    }
  },
};
</script>
<style lang="scss" scoped>
.app-container {
  overflow: auto !important;
}
</style>